<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="作业帮手 - 智能数学作业生成器，提供个性化的数学练习题，包括加减乘除混合运算，适合小学到初中学生使用。">
    <meta name="keywords" content="作业帮手,数学作业,习题生成器,数学练习,小学数学,初中数学,加减乘除,混合运算">
    <meta name="author" content="作业帮手开发团队">
    <meta name="robots" content="index, follow">
    <title>作业帮手 - 智能数学作业生成器</title>
    <link rel="icon" href="{{ url_for('static', filename='images/logo.ico') }}" type="image/x-icon">
    <link rel="stylesheet" href="{{ url_for('static', filename='css/style.css') }}">
</head>
<body>
    <div class="container">
        <h1>数学作业生成器</h1>
        <form action="{{ url_for('preview') }}" method="post">
            <!-- 基本设置 -->
            <div class="form-section">
                <h2>基本设置</h2>
                <div class="form-group">
                    <label>运算类型：</label>
                    <div class="operations-group">
                        <label class="checkbox-label">
                            <input type="checkbox" name="operations[]" value="addition" checked> 加法
                        </label>
                        <label class="checkbox-label">
                            <input type="checkbox" name="operations[]" value="subtraction"> 减法
                        </label>
                        <label class="checkbox-label">
                            <input type="checkbox" name="operations[]" value="multiplication"> 乘法
                        </label>
                        <label class="checkbox-label">
                            <input type="checkbox" name="operations[]" value="division"> 除法
                        </label>
                    </div>
                </div>

                <div class="form-group">
                    <label for="difficulty">难度级别：</label>
                    <select name="difficulty" id="difficulty">
                        <option value="easy">简单</option>
                        <option value="medium">中等</option>
                        <option value="hard">困难</option>
                    </select>
                </div>

                <div class="form-group">
                    <label for="count">题目数量：</label>
                    <input type="number" name="count" id="count" min="1" value="20">
                </div>
            </div>

            <!-- 布局设置 -->
            <div class="form-section">
                <h2>布局设置</h2>
                <div class="form-group">
                    <label for="layout">题目布局：</label>
                    <select name="layout" id="layout">
                        <option value="1">单列</option>
                        <option value="2" selected>双列</option>
                        <option value="3">三列</option>
                        <option value="4">四列</option>
                        <option value="5">五列</option>
                        <option value="6">六列</option>
                    </select>
                </div>

                <div class="form-group">
                    <label for="font_size">字体大小：</label>
                    <select name="font_size" id="font_size">
                        <option value="xs">超小 (12px)</option>
                        <option value="sm">小 (14px)</option>
                        <option value="md" selected>中 (16px)</option>
                        <option value="lg">大 (18px)</option>
                        <option value="xl">超大 (20px)</option>
                        <option value="xxl">特大 (24px)</option>
                    </select>
                </div>

                <div class="form-group">
                    <label for="line_spacing">行间距：</label>
                    <select name="line_spacing" id="line_spacing">
                        <option value="xs">超紧凑 (1.2)</option>
                        <option value="sm">紧凑 (1.4)</option>
                        <option value="md" selected>适中 (1.6)</option>
                        <option value="lg">宽松 (1.8)</option>
                        <option value="xl">超宽松 (2.0)</option>
                        <option value="xxl">特宽松 (2.4)</option>
                    </select>
                </div>
            </div>

            <!-- 学生信息（可选） -->
            <div class="form-section">
                <h2>学生信息（可选）</h2>
                <div class="form-group">
                    <label>
                        <input type="checkbox" id="show_student_info" name="show_student_info" value="1">
                        显示学生信息栏
                    </label>
                </div>
                <div id="student_info_fields" style="display: none;">
                    <div class="form-group">
                        <label for="name_label">姓名标签：</label>
                        <input type="text" name="name_label" id="name_label" value="姓名：">
                    </div>
                    <div class="form-group">
                        <label for="class_label">班级标签：</label>
                        <input type="text" name="class_label" id="class_label" value="班级：">
                    </div>
                    <div class="form-group">
                        <label for="date_label">日期标签：</label>
                        <input type="text" name="date_label" id="date_label" value="日期：">
                    </div>
                </div>
            </div>

            <button type="submit">生成预览</button>
        </form>
    </div>

    <script>
        // 控制学生信息字段的显示/隐藏
        document.getElementById('show_student_info').addEventListener('change', function() {
            document.getElementById('student_info_fields').style.display = 
                this.checked ? 'block' : 'none';
        });
    </script>
</body>
</html>
